$primary-bg-color: #A473E5;
$font-color: #333333;

$--colors: (
  "primary": ("base": #A473E5,
  ),
  "success": ("base": #21ba45,
  ),
  "warning": ("base": #f2711c,
  ),
  "danger": ("base": #db2828,
  ),
  "error": ("base": #db2828,
  ),
  "info": ("base": #909399,
  ),
);

@forward "element-plus/theme-chalk/src/common/var.scss" with ($colors: $--colors);

@use "element-plus/theme-chalk/src/index.scss" as *;

// body {
//   --el-color-primary: #A473E5;
//   --el-color-primary-light-3: rgba(164, 115, 229, .8);
//   --el-color-primary-dark-2: #A473E5;
// }
html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a {
  margin: 0;
  padding: 0;
  color: $font-color;
  font-size: 14px;
}

ul {
  list-style-type: none;
}

.spinner {
  display: none;
  opacity: 0;
}

.container {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 10px 14px;
  box-sizing: border-box;

  .tools {
    margin: 10px 0;
  }

  .table {
    position: relative;
    display: flex;
    flex-direction: column;
    margin-top: 20px;
    background-color: #ffffff;
    padding: 0 20px 10px;
    border-radius: 14px;
    z-index: 1;

    .el-table, tr, th {
      background-color: transparent;
    }

    .el-table {
      z-index: 1;
    }

    // &::after {
    //   content: "";
    //   position: absolute;
    //   top: 0;
    //   left: 0;
    //   right: 0;
    //   bottom: 0;
    //   width: 100%;
    //   height: 100%;
    //   background-color: #ffffff;
    //   border-radius: 14px;
    //   z-index: 0;
    //   backdrop-filter: blur(20px);
    // }
  }

  .pagination {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 15px 0;
  }
}

.el-tooltip__trigger {
  outline: none;
}

.warning {
  color: var(--el-color-warning) !important;

  &:focus {
    background-color: transparent !important;
  }

  &:hover {
    background-color: transparent !important;
  }
}

.delete, .danger {
  color: var(--el-color-danger) !important;

  &:focus {
    background-color: transparent !important;
  }

  &:hover {
    background-color: transparent !important;
  }
}